<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:insert="~{include :: header('修改用户')}" />
    <th:block th:insert="~{include :: select2-css}" />
</head>
<body class="hold-transition">
<div class="container-fluid mt-2 mb-2">
    <form class="form-horizontal" id="form-user-edit" th:object="${manager}">
        <input name="managerId" id="managerId" type="hidden" th:field="*{managerId}" />
        <div class="form-group row">
            <label class="col-sm-2 col-form-label text-sm-right">手机</label>
            <div class="col-sm-3">
                <input placeholder="请输入手机号码" class="form-control" type="text" maxlength="11" th:field="*{mobile}"  th:disabled="*{managerId > 0}">
            </div>
            <label class="col-sm-1 col-form-label text-sm-right">账号</label>
            <div class="col-sm-3">
                <input class="form-control" type="text" th:disabled="*{managerId > 0}" th:field="*{loginName}"/>
            </div>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 col-form-label text-sm-right">姓名</label>
            <div class="col-sm-3">
                <input name="managerName" placeholder="请输入用户名称" class="form-control" type="text" maxlength="30" th:field="*{managerName}">
            </div>
            <label class="col-sm-1 col-form-label text-sm-right">性别</label>
            <div class="col-sm-3">
                <select name="sex" class="form-control m-b" th:with="type=${@dict.getType('qdx_user_sex')}">
                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:checked="${dict.dictValue == manager.sex}" th:field="*{sex}"></option>
                </select>
            </div>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 col-form-label text-sm-right">岗位</label>
            <div class="col-sm-9">
                <select id="post" class="form-control select2-multiple" multiple>
                    <option th:each="post:${posts}" th:value="${post.postId}" th:text="${post.postName}" th:disabled="${post.isDisabled == '1'}"></option>
                </select>
            </div>

        </div>
        <div class="form-group row">
            <label class="col-sm-2 col-form-label text-sm-right">角色</label>
            <div class="col-sm-9 form-inline">
                <label th:each="role:${roles}" class="mr-3">
                    <input name="role" type="checkbox" th:value="${role.roleId}" th:text="${role.roleName}">
                </label>
            </div>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 col-form-label text-sm-right">备注</label>
            <div class="col-sm-9">
                <textarea name="remark" maxlength="500" class="form-control" rows="3">[[*{remark}]]</textarea>
            </div>
        </div>
        <div class="form-group row">
            <label class="col-sm-2 col-form-label text-sm-right">状态</label>
            <div class="col-sm-9 form-inline">
                <label class="toggle-switch switch-solid">
                    <input type="checkbox" id="isDisabled" th:checked="${manager.isDisabled == 1 ? true : false}">
                    <span>禁用</span>
                </label>
            </div>
        </div>
    </form>
</div>
<th:block th:insert="~{include :: footer}" />
<th:block th:insert="~{include :: select2-js}" />
<script type="text/javascript">
    var prefix = "/manager";

    function submitHandler() {
        if ($.validate.form()) {
            var data = $("#form-user-edit").serializeArray();
            var isDisabled = $("input[id='isDisabled']").is(':checked') === true ? 1 : 0;
            var roleIds = $.form.selectCheckeds("role");
            var postIds = $.form.selectSelects("post");
            data.push({"name": "isDisabled", "value": isDisabled});
            data.push({"name": "roleIds", "value": roleIds});
            data.push({"name": "postIds", "value": postIds});
            $.operate.save(prefix + "/edit.json", data);
        }
    }

    $(function() {
        var servicesArray = "[[${roleGroup}]]".split(",");
        $("input[type='checkbox'][name='role']").each(function (i, e) {
            for (var i = 0; i < servicesArray.length; i++) {
                if ($(this).val() === servicesArray[i]) {
                    $(this).prop('checked', true);//这里是直接设置checked为true
                }
            }
        });
        $('#post').val("[[${postGroup}]]".split(",")).trigger("change");
        $('#post').select2({
            placeholder: "请选择岗位",
            allowClear: true
        });
    })
</script>
</body>
</html>